<template>
  <div>
    <nav-header :headerTitle="'收益答疑'" :navBgColor="'#fff'"></nav-header>
    <section class="page">
      <div class="p-header">
        <img src="@/assets/images/aboutUs/backdrop@2x.png" alt />
        <span>高额提成</span>
        <p>开启财富之路</p>
      </div>
      <div class="null84"></div>
      <div class="p-items">
        <div class="content">
          <div class="pi-yuan-left">Q</div>
          <div class="pi-header">
            <img src="@/assets/images/aboutUs/question_1@2x.png" alt />
            <div>好友开通会员收益?</div>
          </div>
          <div class="null32"></div>
          <div class="pi-section">
            <img src="@/assets/images/aboutUs/question_2@2x.png" alt />
            <div>您邀请的好友成为BWRM的会员，您可以获得最高50%的高额提成，邀请越多收益越多。获得的收益可以提现到微信，支付宝。</div>
          </div>
          <div class="pi-yuan-right">A</div>
        </div>
      </div>
      <div class="null84"></div>
      <div class="p-items">
        <div class="content">
          <div class="pi-yuan-left">Q</div>
          <div class="pi-header">
            <img src="@/assets/images/aboutUs/question_1@2x.png" alt />
            <div>好友广告消费收益?</div>
          </div>
          <div class="null32"></div>
          <div class="pi-section">
            <img src="@/assets/images/aboutUs/question_2@2x.png" alt />
            <div>你邀请的好友在人脉圈的每一笔广告消费，您都可以获得提成，最高可得30%的广告消费提成</div>
          </div>
          <div class="pi-yuan-right">A</div>
        </div>
      </div>
      <div class="null84"></div>
      <div class="p-items">
        <div class="content">
          <div class="pi-yuan-left">Q</div>
          <div class="pi-header">
            <img src="@/assets/images/aboutUs/question_1@2x.png" alt />
            <div>如何提升收益?</div>
          </div>
          <div class="null32"></div>
          <div class="pi-section">
            <img src="@/assets/images/aboutUs/question_2@2x.png" alt />
            <div>
              <p>根据您的会员等级，您的提成会成倍增加。例如：您是精英会员，好友广告消费5%提成。</p>
              <div class="null16"></div>
              <p class="cblack">1、升级为高管会员</p>
              <div class="null8"></div>
              <p>好友广告消费提成为精英会员的2倍</p>
              <div class="null16"></div>
              <p class="cblack">2、升级为老板会员</p>
              <div class="null8"></div>
              <p>好友广告消费提成为精英会员的4倍</p>
              <div class="null16"></div>
              <p class="cblack">3、升级为尊享会员</p>
              <div class="null8"></div>
              <p>好友广告消费提成为精英会员的6倍</p>
            </div>
          </div>
          <div class="pi-yuan-right">A</div>
        </div>
      </div>
      <div class="null84"></div>
      <div class="p-items">
        <div class="content">
          <div class="pi-yuan-left">Q</div>
          <div class="pi-header">
            <img src="@/assets/images/aboutUs/question_1@2x.png" alt />
            <div>收益明细?</div>
          </div>
          <div class="null32"></div>
          <div class="pi-section">
            <img src="@/assets/images/aboutUs/question_2@2x.png" alt />
            <div>您邀请的好友成为会员以及每一笔广告消费，您都可以获得高额提成。每一笔提成，都邀请收益里查看详情，真实透明，一目了然。</div>
          </div>
          <div class="pi-yuan-right">A</div>
        </div>
      </div>
      <div class="null84"></div>
      <div class="p-items">
        <div class="content">
          <div class="pi-yuan-left">Q</div>
          <div class="pi-header">
            <img src="@/assets/images/aboutUs/question_1@2x.png" alt />
            <div>如何提升收益?</div>
          </div>
          <div class="null32"></div>
          <div class="pi-section">
            <img src="@/assets/images/aboutUs/question_2@2x.png" alt />
            <div>
              <p>1、您的收益可以提现到零钱。提现到零钱后，您可以把它作为广告费，来扩展您的人脉；您也可以直接提现到微信支付宝账号，除工作日外，48小时内到账。</p>
              <div class="null16"></div>
              <p>2、收益提现没有手续费，只要银行卡，支付宝名字跟实名认证名字致，即可正常提现到账</p>
              <div class="null16"></div>
              <p>3、如果因为网络或者其他原因，提现没有到账，提现会退回给您，您重新提现即可。</p>
            </div>
          </div>
          <div class="pi-yuan-right">A</div>
        </div>
      </div>
      <div class="null84"></div>
    </section>
  </div>
</template>

<script>
import navHeader from "@/components/NavHeader";
import mixin from "@/utils/mixin";
export default {
  name: "Revenue",
  mixins: [mixin],
  components: {
    navHeader
  },
  data() {
    return {
      show: {}
    };
  },
  created() {},
  mounted() {
    this.$setgoindex();
    this.init();
  },
  methods: {
    init: function() {}
  }
};
</script>
<style lang="scss" scoped>
.page {
  margin-top: 86px;
  .null8 {
    width: 100%;
    height: 8px;
  }
  .null16 {
    width: 100%;
    height: 16px;
  }
  .null32 {
    width: 100%;
    height: 32px;
  }
  .null48 {
    width: 100%;
    height: 48px;
  }
  .null64 {
    width: 100%;
    height: 84px;
  }
  .null84 {
    width: 100%;
    height: 84px;
  }
  .p-header {
    width: 100%;
    height: 324px;
    position: relative;
    font-family: PingFangSC-Regular;
    font-size: 64px;
    color: #ffffff;
    letter-spacing: 20px;
    text-shadow: 2px 2px 1px #fdd148;
    text-align: left;
    img {
      width: 100%;
      height: 100%;
    }
    span {
      position: absolute;
      left: 123px;
      top: 58px;
    }
    p {
      position: absolute;
      left: 123px;
      top: 146px;
    }
  }
  .p-items {
    padding-left: 106px;
    padding-right: 106px;
    .content {
      width: 100%;
      height: 100%;
      position: relative;
    }
    .pi-yuan-left {
      width: 56px;
      height: 56px;
      text-align: center;
      line-height: 56px;
      border-radius: 50%;
      background: #ff2525;
      font-family: PingFangSC-Medium;
      font-size: 34px;
      color: #ffffff;
      position: absolute;
      left: -74px;
      top: 32px;
    }
    .pi-yuan-right {
      width: 56px;
      height: 56px;
      background: #ededed;
      text-align: center;
      line-height: 56px;
      border-radius: 50%;
      font-family: PingFangSC-Medium;
      font-size: 34px;
      color: #303133;
      position: absolute;
      right: -74px;
      bottom: 0px;
    }
    .pi-header {
      width: 520px;
      padding-left: 24px;
      height: 88px;
      line-height: 88px;
      background: linear-gradient(
        270deg,
        rgba(254, 145, 64, 1) 0%,
        rgba(255, 37, 37, 1) 100%
      );
      border-radius: 8px;
      position: relative;
      div {
        width: 100%;
        height: 100%;
        font-size: 34px;
        font-family: PingFangSC-Medium;
        font-weight: 500;
        color: rgba(255, 255, 255, 1);
      }
      img {
        position: absolute;
        left: -7px;
        bottom: 0px;
      }
    }
    .pi-section {
      padding: 24px;
      position: relative;
      background: #ededed;
      border-radius: 8px;
      .cblack {
        font-family: PingFangSC-Medium;
        font-size: 30px;
        color: #303133;
        font-weight: bold;
      }
      div {
        font-size: 30px;
        font-family: PingFangSC-Regular;
        font-weight: 400;
        color: rgba(129, 129, 129, 1);
        line-height: 48px;
      }
      img {
        position: absolute;
        right: -7px;
        bottom: 0px;
      }
    }
  }
}
</style>
